import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:ytbusiness/config/yt_theme.dart';
import 'package:ytbusiness/utils/screen_adaptation.dart';
import 'package:ytbusiness/widgets/widgets.dart';

class ShopComment extends StatefulWidget {
  @override
  _ShopCommentState createState() => _ShopCommentState();
}

class _ShopCommentState extends State<ShopComment> {
  List<String> _commentList = [
    "全部",
    "价格便宜",
    "免费送洗车",
    "老板长得帅",
    "有水果吃",
    "工作细致",
    "老板娘貌美如花"
  ];
  List<int> _checkList = [0]; //选中服务类型
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.only(
          top: setWidth(12), left: setWidth(15), right: setWidth(15)),
      color: Colors.white,
      child: CustomScrollView(
        physics: NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        slivers: [
          SliverToBoxAdapter(
            child: Container(
              child: Text(
                "我的评论",
                style: TextStyle(color: Color(0xff323232), fontSize: setSp(15)),
              ),
            ),
          ),
          SliverToBoxAdapter(
            child: SizedBox(
              height: setWidth(10),
            ),
          ),
          SliverToBoxAdapter(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Expanded(
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      Container(
                        child: Wrap(
                          children:addStart(5),
                        ),
                      ),
                      SizedBox(
                        width: setWidth(10),
                      ),
                      Expanded(
                        child: Container(
                          child: RichText(
                              text: TextSpan(children: [
                            TextSpan(
                              text: "4.5分",
                              style: TextStyle(
                                  color: Color(0xffFF921A),
                                  fontSize: setSp(13),
                                  fontWeight: FontWeight.w500),
                            ),
                            TextSpan(
                              text: "(共收到293次评价)",
                              style: TextStyle(
                                  color: Color(0xff989898),
                                  fontSize: setSp(13),
                                  fontWeight: FontWeight.w500),
                            ),
                          ]),
                          maxLines: 1,
                           overflow: TextOverflow.ellipsis,
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
                Container(
                  child: Text(
                    "高于行业平均87%",
                    style: TextStyle(
                        color: Color(0xffFF6701),
                        fontSize: setSp(13),
                        fontWeight: FontWeight.w500),
                  ),
                )
              ],
            ),
          ),
          //评论类型
          SliverToBoxAdapter(
            child: Container(
              margin: EdgeInsets.only(top: setWidth(16)),
              child: Wrap(
                spacing: setWidth(5),
                runSpacing: setWidth(5),
                children: _commentList
                    .asMap()
                    .map((index, value) {
                      return MapEntry(index, _commentItem(index, value));
                    })
                    .values
                    .toList(),
              ),
            ),
          ),
          SliverToBoxAdapter(
            child: SizedBox(
              height: setWidth(30),
            ),
          ),
          //评论类型
          SliverList(
              delegate: SliverChildBuilderDelegate(
                  (context,index){
            return _listItem();
          },
            childCount: 10,
          ))
        ],
      ),
    );
  }
  //评论类型
  Widget _commentItem(int index, String value) {
    return GestureDetector(
      onTap: () {
        setState(() {
          if (_checkList.indexOf(index) != -1) {
            _checkList.remove(index);
          } else {
            _checkList.add(index);
          }
        });
      },
      child: Container(
        decoration: BoxDecoration(
            color: _checkList.indexOf(index) != -1
                ? Color(0xffF1F9F5)
                : Color(0xffF5F5F5),
            border: Border.all(color: Color(0xffF0F0F0), width: setWidth(0.5)),
            borderRadius: BorderRadius.circular(2)),
        padding: EdgeInsets.only(
            top: setWidth(6),
            bottom: setWidth(6),
            left: setWidth(15),
            right: setWidth(15)),
        child: Text(
          value,
          style: TextStyle(
              color: _checkList.indexOf(index) != -1
                  ? YTTheme.theme
                  : Color(0xff989898),
              fontSize: setSp(13)),
        ),
      ),
    );
  }
  //客户评论
  Widget _listItem() {
    return Container(
      margin: EdgeInsets.only(top: setWidth(17)),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Expanded(
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.start,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      height: setWidth(41),
                      width: setWidth(41),
                      decoration: BoxDecoration(
                        image: DecorationImage(
                          image: AssetImage("assets/images/test.png"),fit: BoxFit.cover
                        ),
                        borderRadius: BorderRadius.circular(20)
                      ),
                    ),
                    SizedBox(
                      width: setWidth(8),
                    ),
                    Expanded(
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Container(
                            child: Text("港城宝藏女孩",style: TextStyle(color: Color(0xff333333),fontSize: setSp(15),fontWeight: FontWeight.w500),maxLines: 1,overflow: TextOverflow.ellipsis,),
                          ),
                          SizedBox(
                            height: setWidth(8),
                          ),
                           Container(
                             child: Wrap(
                               children:addStart(5),
                             ),
                           ),
                        ],
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                child: Text("2018-05-12 10:02",style: TextStyle(
                    color: Color(0xff999999),
                    fontSize: setSp(15),)),
              ),
            ],
          ),
          SizedBox(
            height: setWidth(15),
          ),
          Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              SizedBox(
                width: setWidth(49),
              ),
              Expanded(
                child: Container(
                  child: Text("洗车很干净，帮忙去除异味，价格便宜，下次还会再来的",style: TextStyle(
                    color: Color(0xff323232),
                    fontSize: setSp(14),),maxLines: 5,overflow: TextOverflow.ellipsis,),
                ),
              ),
            ],
          ),
          Container(
            margin: EdgeInsets.only(left: setWidth(49),top: setWidth(19)),
            height: setWidth(0.5),
            color: Color(0xffF0F0F0),
          ),
        ],
      ),
    );

  }


}
